import {Collapse, message} from "antd";
import React from "react";
import {publicMethodList} from "@/views/JavaScript/publicMethod/mock";
import SyntaxHighlighter from 'react-syntax-highlighter';
import {CopyToClipboard} from 'react-copy-to-clipboard';
import {
    a11yDark,
    a11yLight,
    agate,
    androidstudio,
    anOldHope,
    arduinoLight, arta, ascetic, atelierCaveDark, atelierDuneDark, atomOneDark, codepenEmbed, dark, dracula, vs
} from 'react-syntax-highlighter/dist/esm/styles/hljs';

const {Panel} = Collapse;
const text = `
  A dog is a type of domesticated animal.
  Known for its loyalty and faithfulness,
  it can be found as a welcome guest in many households across the world.
`;
const onChange = (key: string | string[]) => {
    console.log(key);
};

const PublicMethod = () => {
    return (<Collapse defaultActiveKey={['1']} onChange={onChange}>
            {publicMethodList.map((item, index) => (
                <Panel header={item.name} key={index}>
                    <CopyToClipboard onCopy={() => {
                        message.success('复制成功');
                    }} text={item.html}>
                        <SyntaxHighlighter language="javascript" style={atomOneDark}>
                            {item.html}
                        </SyntaxHighlighter>
                    </CopyToClipboard>

                </Panel>
            ))}
        </Collapse>
    )
}
export default PublicMethod
